import { FormSchema } from '/@/components/Form';
import { ref, Ref } from 'vue';
import { getDictTypeListApi } from '/@/api/admin/dict';
import { GetAllOperate, GetAllCaliber } from '/@/api/admin/dept';
// import { BasicColumn } from '/@/components/Table';
import { putUserPageAllApi } from '/@/api/admin/user';
import { Dayjs } from 'dayjs';

import { useUserStore } from '/@/store/modules/user';
const useUserStores = useUserStore();
let startTime: Dayjs | null;
let endTime: Dayjs | null;
type OperateItem = {
  operateId: string;
  operateName?: string | undefined;
};
type CaliberItem = {
  caliberId: string;
  caliber?: string;
};
export interface ApplesItem {
  applyId: string;
}
let operateList: Ref<OperateItem[]> = ref([]);
let caliberList: Ref<CaliberItem[]> = ref([]);
export const restData = () => {
  startTime = null;
  endTime = null;
  operateList = ref([]);
  caliberList = ref([]);
};

export const formSchema: Function = (callback): FormSchema[] => [
  {
    field: 'taskOddNumbers',
    component: 'Input',
    label: '委托单号',
    required: true,
    // componentProps: {
    //   api: getDictTypeListApi,
    //   labelField: 'label',
    //   valueField: 'value',
    //   params: {
    //     type: 'operate_type',
    //   },
    // },
  },
  {
    field: 'taskType',
    component: 'ApiSelect',
    label: '委托类型',
    required: true,
    componentProps: {
      api: getDictTypeListApi,
      labelField: 'label',
      valueField: 'value',
      params: {
        type: 'operate_type',
      },
    },
  },
  {
    field: 'checkType',
    component: 'ApiSelect',
    required: true,
    label: '委托类别',
    componentProps: {
      api: getDictTypeListApi,
      labelField: 'label',
      valueField: 'value',
      params: {
        type: 'calibration_type',
      },
    },
  },
  {
    field: 'startTime',
    component: 'DatePicker',
    label: '开始时间',
    required: true,
    componentProps: {
      format: 'YYYY/MM/DD',
      showTime: false,
      onChange: (date) => {
        startTime = date;
      },
      disabledDate: (current: Dayjs) => {
        return endTime && current.endOf('day') >= endTime.endOf('day');
      },
    },
  },
  {
    field: 'endTime',
    component: 'DatePicker',
    label: '结束时间',
    required: true,
    componentProps: {
      format: 'YYYY/MM/DD',
      showTime: false,
      onChange: (date) => {
        endTime = date;
      },
      disabledDate: (current: Dayjs) => {
        return startTime && current.endOf('day') <= startTime.endOf('day');
      },
    },
  },
  {
    field: 'caliberId',
    component: 'ApiSelect',
    label: '口径',
    required: true,
    componentProps({ formModel }) {
      return {
        placeholder: '请选择口径',
        disabled: true,
        api: async (params) => {
          if (!caliberList.value.length) {
            caliberList.value = await GetAllCaliber(params);
          }

          return caliberList.value;
        },
        labelField: 'caliber',
        valueField: 'caliberId',
        getPopupContainer: () => document.body,
        onChange: async (value) => {
          operateList.value = await GetAllOperate({ caliberId: value });
          const obj = operateList.value.find((i) => i.operateId === formModel.operateId);
          if (!obj) {
            formModel.operateId = undefined;
          }
          callback && callback(value);
        },
      };
    },
  },
  {
    field: 'operateId',
    component: 'ApiSelect',
    label: '检定车间',
    required: true,
    // { formModel }
    componentProps() {
      return {
        api: async (params) => {
          if (!operateList.value.length) {
            operateList.value = await GetAllOperate(params);
          }
          return operateList.value;
        },
        // onChange: async (value) => {
        //   caliberList.value = await GetAllCaliber({ operateId: value });
        //   const obj = caliberList.value.find((i) => i.caliberId === formModel.caliberId);
        //   if (!obj) {
        //     formModel.caliberId = undefined;
        //   }
        // },
        labelField: 'operateName',
        valueField: 'operateId',
        getPopupContainer: () => document.body,
      };
    },
  },
  {
    field: 'userId',
    component: 'ApiSelect',
    label: '实验室收样人',
    required: true,
    componentProps: {
      api: putUserPageAllApi,
      labelField: 'name',
      valueField: 'userId',
      // mode: 'multiple',
      getPopupContainer: () => document.body,
    },
  },
  {
    field: 'name',
    component: 'Input',
    label: '收样人',
    defaultValue: useUserStores?.getUserInfo?.name,
    // required: true,
    componentProps: {
      disabled: true,
    },
  },
];
